<template>
	<view class="content">
		<!--  手机顶部高度 -->
		<view style="background: #ffffff;" :style="{height: systemBarHeight + 'px'}">
		</view>
		<view class="navbar">
			<uni-nav-bar @clickLeft="fh" :border="false" left-icon="left" title="基本信息" />
		</view>

		<view class="infoimg">
			<view class="infoimg_tt">
				<image src="/static/logo.png" mode=""></image>
				<image style="width: 57.25rpx; height: 57.25rpx; position: absolute; bottom: 0rpx; right: 10rpx;"
					src="/static/mine/infoimg.png" mode=""></image>
			</view>
		</view>

		<view class="infousernamme">
			<text>昵称</text>
			<input type="text" value="" v-model="value" />
		</view>
		
		<view class="bt1">
			<text>退出登录</text>
		</view>
		<view class="bt2">
			<text>保存</text>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				systemBarHeight: 0,
				value: '小暖知识谈'
			}
		},
		mounted() {
			this.getSysteminfo()
		},
		methods: {
			/* 手机顶部高度 */
			getSysteminfo() {
				uni.getSystemInfo({
					success: res => {
						this.systemBarHeight = res.statusBarHeight;
					}
				});
			},
			fh() {
				uni.navigateBack({
					delta: 1 // 返回的页面层级，1表示返回上一页
				});
			},
		}
	}
</script>

<style lang="scss">
	.content {
		width: 750rpx;
		height: 100vh;
		background: #F4F6F9;
		border-radius: 0rpx 0rpx 0rpx 0rpx;
	}

	.infoimg {

		.infoimg_tt {
			width: 191rpx;
			height: 191rpx;
			margin: 32rpx auto 0;
			position: relative;

			>image {
				width: 191rpx;
				height: 191rpx;
				border-radius: 95.5rpx;
			}
		}
	}

	.infousernamme {
		margin: 76rpx auto 0;
		width: 687rpx;
		height: 95rpx;
		background: #FFFFFF;
		border-radius: 23rpx 23rpx 23rpx 23rpx;
		display: flex;
		align-items: center;

		>text {

			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			font-size: 31rpx;
			color: #152034;
			margin-left: 42rpx;
		}

		>input {
			margin-left: auto;
			margin-right: 42rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			font-size: 31rpx;
			color: #7D8CA4;
			text-align: right;
		}
	}
	.bt1{
		width: 626rpx;
		height: 95rpx;
		background: #EFEFEF;
		border-radius: 8rpx 8rpx 8rpx 8rpx;
	margin: 152rpx auto 0;
		font-family: PingFang SC, PingFang SC;
		font-weight: 500;
		font-size: 34rpx;
		color: #45516B;
		display: flex;
		align-items: center;
		justify-content: center;

	}
	.bt2{
		width: 626rpx;
		height: 95rpx;
		background: #1677FF;
		border-radius: 8rpx 8rpx 8rpx 8rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		margin: 30rpx auto 0;

		font-family: PingFang SC, PingFang SC;
		font-weight: 500;
		font-size: 34rpx;
		color: #FFFFFF;

	}
</style>